<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<style>
#price_manage_div_1,#price_manage_div_2,#price_manage_div_div_3,#price_manage_div_4,#price_manage_div_5{
	padding: 10px;
}
#msg2 {
	height: 20px;
	color: red;
}
.modal-content {
	margin-top: 250px;
}
#change_title{
	color:red;
}
#price_manage_div_detail{
	padding:30px 50px;
}
#price_manage_div_table{
	margin-top:15px;
}
#price_manage_div_table {
	text-align: center;
}
input {
	text-align: center;
	width: 50px;
}
td{
	text-align: center;
}
.form-control {
	width: 10%;
	display: inline-block;
}
</style>
<body>
	<div id="price_manage_div" style="display: none" class="row">
				<div id="price_manage_div_detail">
					<button type="button" class="btn btn-info">价格管理</button>
					<table id="price_manage_div_table" class="table table-hover">
						<thead>
							<tr style="text-align: center;">
								<th style="text-align: center;">序号</th>
								<th style="text-align: center;">衣服种类</th>
								<th style="text-align: center;">洗衣方法</th>
								<th style="text-align: center;">价格</th>
								<th style="text-align: center;">操作</th>
								<th style="text-align: center; display: none">id</th>
							</tr>
						</thead>
						<tbody id="price_manage_div_table_tbody">
							
						</tbody>
					</table>
				</div>
			</div>
						<!-- btn修改洗衣方法Modal -->
	<div class="modal fade" id="btn_change_price" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title" id="change_title">修改价格</h4>
				</div>
				<form id="btn_change_price_form">
					<div class="modal-body" id="change_div">
						<div id="price_manage_div_1" class="input-group">
							<span class="input-group-addon">衣服种类:</span> <input type="text"
								class="form-control" placeholder="请输入衣服种类"
								aria-describedby="basic-addon1" required="required" disabled="disabled"
								name="price_yfzl">
						</div>
						<div id="price_manage_div_2" class="input-group">
							<span class="input-group-addon">洗衣方法:</span> <input type="text"
								class="form-control" placeholder="请输入洗衣方法"
								aria-describedby="basic-addon1" required="required" disabled="disabled"
								name="price_xyff">
						</div>
						<div id="price_manage_div_2" class="input-group">
							<span class="input-group-addon">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价格:</span> <input type="text"
								class="form-control" placeholder="请输入价格"
								aria-describedby="basic-addon1" required="required"
								name="price_price">
						</div>
						<div id="price_manage_div_4" class="input-group" style="display: none">
							<span class="input-group-addon">id:</span> <input type="text"
								class="form-control"
								aria-describedby="basic-addon1" required="required"
								name="price_id" disabled="disabled" >
						</div>
						<div id="msg2">
							<span class="msg2_span1"></span>
							<span class="msg2_span2"></span>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button type="submit" class="btn btn-primary">修改</button>
					</div>
				</form>
			</div>
		</div>
		</div>
</body>
<script type="text/javascript">
$("#btn_change_price_form").submit(function() {
	$(".msg2_span1").html("");
	$(".msg2_span2").html("");
	$.ajax({
		url : "change_price", //请求的url地址
		contentType : "application/json; charset=utf-8",
		dataType : "json", //返回格式为json
		type : "POST", //请求方式
		data : JSON.stringify({
			'yfzl' : $(
					"#btn_change_price_form input[ name='price_yfzl' ] ")
					.val(),
			'xyff' : $(
					"#btn_change_price_form input[ name='price_xyff' ] ")
					.val(),
			'price' : $(
					"#btn_change_price_form input[ name='price_price' ] ")
					.val(),
			'id':$(
			"#btn_change_price_form input[ name='price_id' ] ")
			.val(),
		}),
		beforeSend : function() {
		},
		success : function(data) {
			if (data.isSuccess) {
				$(".msg2_span1").html("修改成功...");
				$("#btn_change_price").modal('hide');
				priceManageQuery();
			} else {
				$(".msg2_span1").html("修改失败...");
			}
		},
		error : function(req) {
			alert("  error  请联系开发人员 ！");
		}
	});
	return false;
});
function btnChangeprice(obj){
	$(".msg2_span1").html("");
	$("#btn_change_price_form input:eq(0)").val($(obj).parent().parent().children("td:eq(1)").html());
	$("#btn_change_price_form input:eq(1)").val($(obj).parent().parent().children("td:eq(2)").html());
	$("#btn_change_price_form input:eq(2)").val($(obj).parent().parent().children("td:eq(3)").children("input").val());
}
function priceManageQuery(){
	$(".msg2_span1").html("");
	$.ajax({
		url : "query_price", //请求的url地址
		contentType : "application/json; charset=utf-8",
		dataType : "json", //返回格式为json
		type : "POST", //请求方式
		beforeSend : function() {
		},
		success : function(data) {
			if(data.prices.length > 0){
				var str = '';
				for(var i = 0;i < data.prices.length;i++){
					str += "<tr><td>" + (i+1) + "</td><td>" 
					+ data.prices[i].yfzl +"</td><td>"
					+ data.prices[i].xyff + "</td>";
					if(data.prices[i].price == null){
						str += "<td><input type='text' class='form-control' value="+0+"></td>"
					}else{
						str += "<td><input type='text' class='form-control' value="+data.prices[i].price+"></td>"
					}
					str += "<td><button type='button' class='btn btn-warning' data-toggle='modal' data-target='#btn_change_price' onclick='btnChangeprice(this)'>修改</button></td><td style='display: none'>"+ data.prices[i].id +"</td></tr>"
				}
				$("#price_manage_div_table_tbody").html(str);
			}else{
				$("#price_manage_div_table_tbody").html("没有数据...");
			}
		},
		error : function(req) {
			alert(JSON.stringify(req));
			alert("  error  请联系开发人员 ！");
		}
	});
	return false;
}
</script>
</html>